iT邦幫忙

2022 iThome 鐵人賽

DAY 15
0
Mobile Development

Android studio 30天新手筆記系列 第 15

Day15-Android新手筆記-DataBinding+onClick

  • 分享至 

  • xImage
  •  

接續前一篇DataBinding的基本用法後,本篇來介紹點擊事件的綁定方法。最近使用DataBinding踩了一些坑,也研究了好一陣子,對於DataBinding的使用有一些見解。在這邊跟大家分享,也幫自己做個紀錄。

/images/emoticon/emoticon06.gif

XML設定

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools">

    <data>
        <variable
            name="value"
            type="com.example.it_demo_databinding.MainModel" />
        <variable
            name="view"
            type="com.example.it_demo_databinding.MainActivity" />
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <EditText
            android:id="@+id/editText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ems="10"
            android:inputType="textPersonName"
            android:text="@={value.name}"
            app:layout_constraintBottom_toTopOf="@+id/textView"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{value.name}"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="80dp"
            android:text="無參數"
            android:onClick="@{()->view.noParametricOnClick()}"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.498"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/textView" />

        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="帶參數"
            android:onClick="@{()->view.haveParametricOnClick(value.name)}"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/button" />

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

這邊建立兩個Button來分別介紹有傳值跟沒有傳值兩種狀況的使用方式,並透過Logcat將值或狀態顯示出來。基本使用方式利用 @{()->事件位置} 將事件與元件綁定:

JAVA程式碼

public class MainActivity extends AppCompatActivity {
    //這邊作為Data來源
    MainModel mainModel;
    //ActivityMainBinding由系統建立
    //如果沒有可能是忘記 Make Project => 上方導航列 -> Build -> Make Project
    ActivityMainBinding mainBinding;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        mainModel = new MainModel();
        //將View與Model綁定
        mainBinding = DataBindingUtil.setContentView(this,R.layout.activity_main);
        mainBinding.setValue(mainModel);
        mainBinding.setView(this);

        mainBinding.editText.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {
                //內容變化前
            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                //內容變化中
                mainBinding.setValue(mainModel);
            }

            @Override
            public void afterTextChanged(Editable s) {
                //內如變化後
                mainBinding.setValue(mainModel);
            }
        });
    }
    public void noParametricOnClick(){
        Log.v("noParametric","無傳值");
    }
    public void haveParametricOnClick(String name){
        Log.v("haveParametric","有傳值 : "+name);
    }
}

XML中的 @{()->view.noParametricOnClick()} 與 @{()->view.haveParametricOnClick(value.name)} 分別對應Java程式中的 noParametricOnClick() 與 haveParametricOnClick(String name)。

其中的 value.name 會取得MainModel中的name資料,並帶入 haveParametricOnClick(String name)。

結果:

/images/emoticon/emoticon41.gif


上一篇
Day12-Android新手筆記-DataBinding
下一篇
Day16-Android新手筆記-SharedPreferences
系列文
Android studio 30天新手筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言